<?php
use yii\helpers\Html;
use yii\bootstrap\ActiveForm;
use yii\helpers\Url;

$this->title = '客服设置';
?>
<?= Html::cssFile('./assets/css/uploadsoft.css')?>
<?= Html::jsFile('./assets/uploadsoft/jquery.min.js')?>
<?= Html::jsFile('./assets/uploadsoft/jquery.form.js')?>
<?= Html::jsFile('./assets/js/systemupload.js')?>
<div class="container">
	<div class="row">

		<?php echo $this->render('_leftnav') ?>
		<div class="col-md-10">
			<div class="page-header clearfix">
				<h1 class="pull-left">客服</h1>
				<div class="pull-right">

				</div>
			</div>


			<?php echo $this->render('_sitesetting') ?>

			<!--站点配置表单类-->
			<?php
			$form = ActiveForm::begin([
				'options' => ['class' => 'form-horizontal','id'=>'consult-setting-form','enctype' => 'multipart/form-data'],
				'action'=>Url::to(['system/settingservicesave']),
				'method'=>'post',
				'fieldConfig' => [
					'template' => '<div class="row form-group"><div class="col-md-3 control-label">{label}</div><div class="controls col-md-8 radios">
{input}{error}</div></div>'
				],
			]);
			?>


			<?= $form->field($model, 'qq_status')->radioList(['1'=>'开启','0'=>'关闭']) ?>

			<fieldset>
				<legend>QQ客服设置</legend>

				<div id="consult-qq">
					<?php foreach($qq_message as $k=>$v){?>
					<div class="row form-group has-feedback">
						<div class="controls col-md-4 col-md-offset-3">
							<input name="qq[<?php echo $k;?>][name]" class="form-control" placeholder="QQ客服名称" type="text" value="<?php echo $v['0']?>">
						</div>
						<div class="controls col-md-4">
							<input name="qq[<?php echo $k;?>][number]" class="form-control" placeholder="QQ号" type="text" value="<?php echo $v['1']?>">
						</div>
					</div>
					<?php } ?>
				</div>
				<div class="row form-group">
					<div class="controls col-md-4 col-md-offset-3">
						<span class="btn-link" data-role="item-add" data-length="1" val="<?php echo count($qq_message)-1;?>" type="1">新增</span>
					</div>
				</div>
			</fieldset>

			<fieldset>
				<legend>QQ群设置</legend>
				<div id="consult-qqgroup">
					<?php foreach($qq_group as $k=>$v){?>
						<div class="row form-group has-feedback">
							<div class="controls col-md-4 col-md-offset-3">
								<input name="qqgroup[<?php echo $k;?>][name]" class="form-control" value="<?php echo $v[0]?>" placeholder="QQ群名称" type="text">
							</div>
							<div class="controls col-md-4">
								<input name="qqgroup[<?php echo $k;?>][number]" class="form-control" value="<?php echo $v[1]?>" placeholder="QQ群号" type="text">
							</div>
						</div>
					<?php } ?>
				</div>
				<div class="row form-group">
					<div class="controls col-md-4 col-md-offset-3">
						<span class="btn-link" val="<?php echo count($qq_group)-1;?>" data-length="3" type="2">新增</span>
					</div>
				</div>
			</fieldset>

			<fieldset>
				<legend>联系电话设置</legend>

				<?= $form->field($model, 'work_time',['template'=>'<div class="row form-group"><div class="col-md-3 control-label">{label}</div><div class="controls col-md-8">{input}{error}</div></div>'])->textInput() ?>

				<div id="consult-phone">
					<?php foreach($phone_message as $k=>$v){?>
						<div class="row form-group has-feedback">
							<div class="controls col-md-4 col-md-offset-3">
								<input name="phone[<?= $k; ?>][name]" class="form-control" value="<?= $v[0];?>" placeholder="联系人" type="text">
							</div>
							<div class="controls col-md-4">
								<input name="phone[<?= $k; ?>][number]" class="form-control" value="<?= $v[1]?>" placeholder="联系电话" type="text">
							</div>
						</div>
					<?php } ?>
				</div>
				<div class="row form-group">
					<div class="controls col-md-4 col-md-offset-3">
						<span class="btn-link" data-role="item-add" val="<?= count($phone_message)-1;?>" type="3" data-length="3">新增</span>
					</div>
				</div>
			</fieldset>

			<fieldset>
				<legend>其他设置</legend>
				<div class="row form-group">
					<div class="col-md-3 control-label">
						<label>微信二维码</label>
					</div>
					<div class="col-md-8 controls">
						<div id="consult-container old" class="choose">
							<img id="systemimg" alt="" class="picture" src="http://files.bwphp.com/file/image/show/150/150?path=<?php echo $model->wechat_code;?>">
						</div>

						<div class="row form-group">
							<div class="controls col-md-8 radios">
								<div class="form-group" style="margin-left:0px" >
									<p class="help-block">你可以上传jpg, gif, png格式的文件, 图片建议尺寸至少为480x270。<br>文件大小不能超过<strong>2M</strong>。</p>
									<input type="hidden" id="system_thumb" name="SettingserviceFrom[wechat_code]">
									<div class="btn" style="">
										<span>添加图片</span>
										<?= Html::fileInput('filedata','', ['id'=>'fileupload']) ?>
									</div>
									<div class="progress" style='margin-left:100px'>
										<span class="bar"></span><span class="percent">0%</span >
									</div>
									<div class="files" style='margin-left:0px'></div>
									<div id="showimg"></div>
								</div>
								<p class="help-block help-block-error"></p>
							</div>
						</div>




						<p class="help-block">请上传png, gif, jpg格式的图片文件。</p>
					</div>
				</div>

				<?= $form->field($model, 'work_email',['template'=>'<div class="row form-group"><div class="col-md-3 control-label">{label}</div><div class="controls col-md-8">{input}{error}</div></div>'])->textInput(['id' => 'email']) ?>

			</fieldset>

			<div class="row form-group">
				<div class="col-md-3 control-label"></div>
				<div class="controls col-md-8">
					<?= Html::submitButton('提交', ['class'=>'btn btn-primary']) ?>
				</div>
			</div>

			<?php ActiveForm::end(); ?>

		</div>

	</div>
</div>
<script>
	$(".btn-link").click(function(){
		var val = $(this).attr("val");
		var type = $(this).attr("type");
		if(type == 1)
		{
			if(parseInt(val) > 8)
			{
				alert('最多添加10个QQ客服');
			}else {
				var new_val = parseInt(val) + 1;
				var formadd = '<div class="row form-group has-feedback">' + '<div class="controls col-md-4 col-md-offset-3">' + '<input name="qq[' + new_val + '][name]" class="form-control" placeholder="QQ客服名称" type="text">' + '</div><div class="controls col-md-4">' + '<input name="qq[' + new_val + '][number]" class="form-control" placeholder="QQ号" type="text">' + '</div></div>'
				$("#consult-qq").append(formadd);
				$(this).attr("val", new_val);
			}
		}else if(type == 2){
			if(parseInt(val) > 8)
			{
				alert('最多添加10个QQ群');
			}else {
				var new_val = parseInt(val) + 1;
				var formadd = '<div id="consult-qqgroup">'+'<div class="row form-group has-feedback">'+'<div class="controls col-md-4 col-md-offset-3">'+'<input name="qqgroup['+new_val+'][name]" class="form-control" value="" placeholder="QQ群名称" type="text">'+'</div><div class="controls col-md-4">'+'<input name="qqgroup['+new_val+'][number]" class="form-control" value="" placeholder="QQ群号" type="text">'+'</div></div></div>'
				$("#consult-qqgroup").append(formadd);
				$(this).attr("val", new_val);
			}
		}else
		{
			var new_val = parseInt(val) + 1;
			var formadd = '<div class="row form-group has-feedback">'+'<div class="controls col-md-4 col-md-offset-3">'+'<input name="phone['+new_val+'][name]" class="form-control" value="" placeholder="联系人" type="text">'+'</div><div class="controls col-md-4">'+'<input name="phone['+new_val+'][number]" class="form-control" value="" placeholder="联系电话" type="text">'+'</div></div>';
			$("#consult-phone").append(formadd);
			$(this).attr("val", new_val);
		}
	})

	$("#change_img").change(function() {
		var file = document.getElementById("change_img").files[0];
		var tmpimg=document.createElement('img');

		tmpimg.src=window.URL.createObjectURL(file);
        tmpimg.style.width = '100px';
//		<div id="consult-container old" class="choose">
		$('.choose').replaceWith('<div id="consult-container old" class="choose new"></div>');
		$("#old").hide();
		$(".new").html(tmpimg);
	});
</script>
